import React, { Component } from 'react';
import { Link } from 'react-router-dom';
import {  Mention } from 'antd';
import $ from 'jquery';
import './css/common.css';


class CommonHeader extends Component {
  
    constructor (props) {
		super(props);
		this.state = {
            key:""
        };
    }

    changeKey(contentState) {
        let str = $("#key").val();
        this.setState({
            key:str
        });
    }
  
    render() {
    return (
        <div>
            <div className="common-container clearfix">
            <Link className="menus" to="/">首页</Link>
                <form className="serch">
                    <input type="text" id="key" onChange={() => this.changeKey()} placeholder="学生信息搜索" />
                    <span>&#xe600;</span>
                    <Link to={`/search/${this.state.key}`} className="search-submit">搜 索</Link>
                </form>
                <ul className="list clearfix">
                    <Link to="/edit" href="###"><img src="https://i.loli.net/2019/02/28/5c77aa084a196.png" className="personal-news" /><span>个人中心</span></Link>
                    <li><Link to="/edit">&#xe625; 录入信息</Link></li>
                    <li><a href="###">&#xe652; 退出</a></li>
                </ul>
            </div>
        </div>
    );
  }
}

export default CommonHeader;